import { ResponseTask } from '@entities/Tasks'
import { useDeleteTaskMutation } from '@shared/api'
import { Button } from '@shared/ui/Button'
import { Toast } from '@shared/ui/Toast'
import { memo } from 'react'
import { Zoom, toast } from 'react-toastify'

interface TaskDeleteButtonProps {
  className?: string
  task: ResponseTask
}

export const TaskDeleteButton = memo(({ className, task }: TaskDeleteButtonProps) => {
  const [deleteTask] = useDeleteTaskMutation()
  const handleDelete = (e: React.MouseEvent) => {
    e.stopPropagation()
    deleteTask(task.id)
    toast(<Toast message='Задача удалена!' type='negative' />, {
      transition: Zoom,
    })
  }
  return (
    <Button
      circle
      className={className}
      color='error'
      iconName='close'
      onClick={handleDelete}
      size='small'
    />
  )
})

TaskDeleteButton.displayName = 'TaskDeleteButton'
